﻿import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:get/get.dart';
import 'package:getx_scaffold/getx_scaffold.dart';
import 'menstrual_cycle_notification_logic.dart';

/// 生理期提醒设置页面
class MenstrualCycleNotificationView extends GetView<MenstrualCycleNotificationLogic> {
  const MenstrualCycleNotificationView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: SafeArea(
        child: Column(
          children: [
            // 头部
            _buildHeader(),
            
            // 内容
            Expanded(
              child: Padding(
                padding: EdgeInsets.all(24.w),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    // 描述文本
                    Text(
                      '开启后，App 将在对应时间发出提醒。',
                      style: TextStyle(
                        fontSize: 14.sp,
                        color: Colors.grey[400],
                      ),
                    ),
                    
                    SizedBox(height: 32.h),
                    
                    // 全部启用开关
                    _buildAllEnabledSwitch(),
                    
                    SizedBox(height: 1.h),
                    Divider(color: Colors.grey[800], height: 1),
                    SizedBox(height: 24.h),
                    
                    // 各种提醒设置
                    _buildNotificationItem(
                      icon: Icons.water_drop,
                      color: Colors.pink,
                      title: '生理期提醒',
                      subtitle: '经期开始前一天提醒您。',
                      isEnabled: controller.state.periodReminderEnabled,
                    ),
                    
                    SizedBox(height: 24.h),
                    
                    _buildNotificationItem(
                      icon: Icons.favorite,
                      color: Colors.pink,
                      title: '排卵提醒',
                      subtitle: '排卵期开始前一天提醒您。',
                      isEnabled: controller.state.ovulationReminderEnabled,
                    ),
                    
                    SizedBox(height: 24.h),
                    
                    _buildNotificationItem(
                      icon: Icons.circle,
                      color: Colors.pink,
                      title: '排卵日提醒',
                      subtitle: '排卵高峰开始前一天提醒您。',
                      isEnabled: controller.state.ovulationDayReminderEnabled,
                    ),
                    
                    SizedBox(height: 24.h),
                    
                    _buildNotificationItem(
                      icon: Icons.notifications,
                      color: Colors.pink,
                      title: '排卵结束提醒',
                      subtitle: '排卵期结束时会提醒您。',
                      isEnabled: controller.state.ovulationEndReminderEnabled,
                    ),
                    
                    SizedBox(height: 32.h),
                    
                    // 提醒时间设置
                    _buildReminderTimeSection(),
                    
                    const Spacer(),
                    
                    // 底部按钮
                    _buildBottomButtons(),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  /// 构建头部
  Widget _buildHeader() {
    return Padding(
      padding: EdgeInsets.all(20.w),
      child: Row(
        children: [
          GestureDetector(
            onTap: () => Get.back(),
            child: Container(
              width: 40.w,
              height: 40.w,
              decoration: BoxDecoration(
                color: Colors.grey[800],
                borderRadius: BorderRadius.circular(12.r),
              ),
              child: Icon(
                Icons.arrow_back_ios_new,
                color: Colors.white,
                size: 20.sp,
              ),
            ),
          ),
          
          Expanded(
            child: Center(
              child: Text(
                '生理期提醒',
                style: TextStyle(
                  fontSize: 20.sp,
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
            ),
          ),
          
          SizedBox(width: 40.w), // 占位，保持居中
        ],
      ),
    );
  }

  /// 构建全部启用开关
  Widget _buildAllEnabledSwitch() {
    return Obx(() {
      return Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(
            '全部启用',
            style: TextStyle(
              fontSize: 18.sp,
              fontWeight: FontWeight.w600,
              color: Colors.white,
            ),
          ),
          
          CupertinoSwitch(
            value: controller.state.allEnabled.value,
            onChanged: (value) => controller.toggleAllEnabled(value),
            activeColor: const Color(0xFFFF6B35),
          ),
        ],
      );
    });
  }

  /// 构建通知项
  Widget _buildNotificationItem({
    required IconData icon,
    required Color color,
    required String title,
    required String subtitle,
    required RxBool isEnabled,
  }) {
    return Obx(() {
      return Row(
        children: [
          Container(
            width: 40.w,
            height: 40.w,
            decoration: BoxDecoration(
              color: color.withOpacity(0.2),
              borderRadius: BorderRadius.circular(8.r),
            ),
            child: Icon(
              icon,
              color: color,
              size: 20.sp,
            ),
          ),
          
          SizedBox(width: 16.w),
          
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: TextStyle(
                    fontSize: 16.sp,
                    fontWeight: FontWeight.w600,
                    color: Colors.white,
                  ),
                ),
                
                SizedBox(height: 4.h),
                
                Text(
                  subtitle,
                  style: TextStyle(
                    fontSize: 12.sp,
                    color: Colors.grey[400],
                  ),
                ),
              ],
            ),
          ),
          
          CupertinoSwitch(
            value: isEnabled.value,
            onChanged: (value) =>
                controller.toggleNotificationItem(isEnabled, value),
            activeColor: const Color(0xFFFF6B35),
          ),
        ],
      );
    });
  }

  /// 构建提醒时间设置
  Widget _buildReminderTimeSection() {
    return Obx(() {
      return GestureDetector(
        onTap: () => _showTimePicker(),
        child: Container(
          padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 20.h),
          decoration: BoxDecoration(
            color: Colors.grey[900],
            borderRadius: BorderRadius.circular(12.r),
            border: Border.all(color: Colors.grey[700]!),
          ),
          child: Row(
            children: [
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      '提醒时间',
                      style: TextStyle(
                        fontSize: 16.sp,
                        fontWeight: FontWeight.w600,
                        color: Colors.white,
                      ),
                    ),
                    
                    SizedBox(height: 4.h),
                    
                    Text(
                      '通知将在指定时间发送。',
                      style: TextStyle(
                        fontSize: 12.sp,
                        color: Colors.grey[400],
                      ),
                    ),
                  ],
                ),
              ),
              
              Text(
                controller.state.reminderTime.value,
                style: TextStyle(
                  fontSize: 16.sp,
                  fontWeight: FontWeight.w600,
                  color: const Color(0xFFFF6B35),
                ),
              ),
              
              SizedBox(width: 8.w),
              
              Icon(
                Icons.chevron_right,
                color: Colors.grey[500],
                size: 20.sp,
              ),
            ],
          ),
        ),
      );
    });
  }

  /// 构建底部按钮
  Widget _buildBottomButtons() {
    return Row(
      children: [
        Expanded(
          child: Container(
            height: 56.h,
            child: TextButton(
              onPressed: () => Get.back(),
              style: TextButton.styleFrom(
                backgroundColor: Colors.transparent,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(28.r),
                  side: BorderSide(color: Colors.grey[600]!),
                ),
              ),
              child: Text(
                '取消',
                style: TextStyle(
                  fontSize: 18.sp,
                  fontWeight: FontWeight.w600,
                  color: Colors.white,
                ),
              ),
            ),
          ),
        ),
        
        SizedBox(width: 16.w),
        
        Expanded(
          child: Container(
            height: 56.h,
            child: ElevatedButton(
              onPressed: () async {
                await controller.saveSettings();
                Get.back();
              },
              style: ElevatedButton.styleFrom(
                backgroundColor: const Color(0xFFFF6B35),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(28.r),
                ),
                elevation: 0,
              ),
              child: Text(
                '完成',
                style: TextStyle(
                  fontSize: 18.sp,
                  fontWeight: FontWeight.w600,
                  color: Colors.white,
                ),
              ),
            ),
          ),
        ),
      ],
    );
  }

  /// 显示时间选择器
  void _showTimePicker() {
    showModalBottomSheet(
      context: Get.context!,
      backgroundColor: Colors.grey[900],
      isScrollControlled: true,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(20.r)),
      ),
      builder: (context) => _buildTimePickerBottomSheet(),
    );
  }

  /// 构建时间选择器底部弹窗
  Widget _buildTimePickerBottomSheet() {
    final selectedHour = RxInt(10);
    final selectedMinute = RxInt(0);
    
    // 解析当前时间
    final currentTime = controller.state.reminderTime.value;
    final timeParts = currentTime.split(':');
    if (timeParts.length == 2) {
      selectedHour.value = int.tryParse(timeParts[0]) ?? 10;
      selectedMinute.value = int.tryParse(timeParts[1]) ?? 0;
    }
    
    return Container(
      height: 400.h,
      padding: EdgeInsets.all(24.w),
      child: Column(
        children: [
          // 头部
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              TextButton(
                onPressed: () => Get.back(),
                child: Text(
                  '取消',
                  style: TextStyle(
                    fontSize: 16.sp,
                    color: Colors.grey[400],
                  ),
                ),
              ),
              
              Text(
                '提醒时间',
                style: TextStyle(
                  fontSize: 18.sp,
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
              
              TextButton(
                onPressed: () {
                  final hour = selectedHour.value.toString().padLeft(2, '0');
                  final minute = selectedMinute.value.toString().padLeft(2, '0');
                  controller.state.reminderTime.value = '$hour:$minute';
                  Get.back();
                },
                child: Text(
                  '完成',
                  style: TextStyle(
                    fontSize: 16.sp,
                    color: const Color(0xFFFF6B35),
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
            ],
          ),
          
          SizedBox(height: 20.h),
          
          // 时间选择器
          Expanded(
            child: Row(
              children: [
                // 小时选择
                Expanded(
                  child: Container(
                    decoration: BoxDecoration(
                      color: Colors.grey[800],
                      borderRadius: BorderRadius.circular(12.r),
                    ),
                    child: Column(
                      children: [
                        Padding(
                          padding: EdgeInsets.all(16.w),
                          child: Text(
                            '时',
                            style: TextStyle(
                              fontSize: 16.sp,
                              fontWeight: FontWeight.bold,
                              color: Colors.white,
                            ),
                          ),
                        ),
                        Expanded(
                          child: ListView.builder(
                            itemCount: 24,
                            itemBuilder: (context, index) {
                              final hour = index;
                              return Obx(() {
                                final isSelected = selectedHour.value == hour;
                                
                                return GestureDetector(
                                  onTap: () => selectedHour.value = hour,
                                  child: Container(
                                    height: 50.h,
                                    decoration: BoxDecoration(
                                      color: isSelected ? const Color(0xFFFF6B35).withOpacity(0.3) : Colors.transparent,
                                      borderRadius: BorderRadius.circular(8.r),
                                    ),
                                    child: Center(
                                      child: Text(
                                        hour.toString().padLeft(2, '0'),
                                        style: TextStyle(
                                          fontSize: 18.sp,
                                          color: isSelected ? const Color(0xFFFF6B35) : Colors.white,
                                          fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                                        ),
                                      ),
                                    ),
                                  ),
                                );
                              });
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                
                SizedBox(width: 12.w),
                
                // 分钟选择
                Expanded(
                  child: Container(
                    decoration: BoxDecoration(
                      color: Colors.grey[800],
                      borderRadius: BorderRadius.circular(12.r),
                    ),
                    child: Column(
                      children: [
                        Padding(
                          padding: EdgeInsets.all(16.w),
                          child: Text(
                            '分',
                            style: TextStyle(
                              fontSize: 16.sp,
                              fontWeight: FontWeight.bold,
                              color: Colors.white,
                            ),
                          ),
                        ),
                        Expanded(
                          child: ListView.builder(
                            itemCount: 60,
                            itemBuilder: (context, index) {
                              final minute = index;
                              return Obx(() {
                                final isSelected = selectedMinute.value == minute;
                                
                                return GestureDetector(
                                  onTap: () => selectedMinute.value = minute,
                                  child: Container(
                                    height: 50.h,
                                    decoration: BoxDecoration(
                                      color: isSelected ? const Color(0xFFFF6B35).withOpacity(0.3) : Colors.transparent,
                                      borderRadius: BorderRadius.circular(8.r),
                                    ),
                                    child: Center(
                                      child: Text(
                                        minute.toString().padLeft(2, '0'),
                                        style: TextStyle(
                                          fontSize: 18.sp,
                                          color: isSelected ? const Color(0xFFFF6B35) : Colors.white,
                                          fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                                        ),
                                      ),
                                    ),
                                  ),
                                );
                              });
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}




